import Taro from '@tarojs/taro-rn';
import * as tslib_1 from "tslib";
import React from 'react';
import { Component } from "@tarojs/taro-rn";
import { View, Input, Picker, Image, Textarea, Form, Button } from "@tarojs/components-rn";
import { inject, observer } from "@tarojs/mobx-rn";
import PageFooterInfo from "../../components/PageFooterInfo";
import PickerArea from "../../components/PickerArea";
import page3_demandStyleSheet from "./page3_demand_styles";

import right from '../../assets/img/right.png';
import { getRuntime, qualificationsTypeArr, enterpriseQualificationArr, taxTypesArr, projectPriceArr } from "../../utils/common";
var _styleSheet = page3_demandStyleSheet;
let Page3 = class Page3 extends Component {
  constructor(props) {
    super(props);
    this.state = {
      title: '',
      qualificationsTypeArr: qualificationsTypeArr,
      qualificationsType: '',
      qualificationsTypeIndex: null,
      priceIntervalArr: projectPriceArr,
      priceInterval: '',
      qualificationLevelArr: enterpriseQualificationArr,
      qualificationLevel: '',
      taxpayerTypeArr: taxTypesArr,
      taxpayerType: '',
      remarks: '',
      contactsName: '',
      contactsPhone: '',
      contactsWechat: '',
      contactsQQ: '',
      contactsArea: '',
      areaCode: null,
      loading: false,
      disabled: false,
      submitText: '立即发布'
    };
  }
  componentWillMount() {
    Taro.setNavigationBarTitle({ title: '发布信息' });
  }
  handelRouter(url = '/pages/index/index') {
    getRuntime().navigateTo(url);
  }
  changePicker(type, e) {
    console.log(type);
    console.log(e.detail.value);
    this.setState({
      [type]: this.state[type + 'Arr'][e.detail.value]
    });
    if (type === 'qualificationsType') {
      this.setState({
        qualificationsTypeIndex: e.detail.value
      });
    }
  }
  onPicketArea(res) {
    this.setState({
      contactsArea: res.province.label,
      areaCode: res.province.value
    });
  }
  formSubmit(e) {
    let { qualificationsType, qualificationsTypeIndex, qualificationLevel, priceInterval, taxpayerType, areaCode, contactsArea } = this.state;
    let { title, remarks, contactsName, contactsPhone, contactsWechat, contactsQQ } = e.detail.value;
    let { FinancialCenterStore } = this.props.stores;
    if (!title) {
      getRuntime().showToast('标题不能为空~');
      return false;
    }
    if (qualificationsTypeIndex == null) {
      getRuntime().showToast('请选择资质类别~');
      return false;
    }
    if (!qualificationLevel) {
      getRuntime().showToast('请选择资质级别~');
      return false;
    }
    if (!contactsPhone) {
      getRuntime().showToast('联系人电话不能为空~');
      return false;
    }
    if (!areaCode) {
      getRuntime().showToast('请选择联系地址~');
      return false;
    }
    this.setState({
      loading: true,
      disabled: true,
      submitText: '数据提交中...'
    });
    FinancialCenterStore.saveQualificationServiceCenter({
      form: {
        title,
        qualificationsType: qualificationsTypeIndex ? qualificationsTypeIndex + 1 : null,
        priceInterval,
        qualificationLevel,
        taxpayerType,
        remarks,
        contactsName,
        contactsPhone,
        contactsWechat,
        contactsQQ,
        contactsArea,
        areaCode
      },
      callback: () => {
        this.setState({
          loading: false,
          disabled: false,
          submitText: '立即发布'
        });
        Taro.showModal({
          title: '数据提交成功',
          content: '返回列表查看~',
          showCancel: false
        }).then(res => {
          if (res.confirm) {
            getRuntime().navigateBack();
          }
        });
      }
    });
  }
  render() {
    let { loading, disabled, submitText, qualificationLevel, qualificationLevelArr, priceInterval, priceIntervalArr, qualificationsType, qualificationsTypeArr, taxpayerType, taxpayerTypeArr } = this.state;
    return <View style={_styleSheet["from-wrap"]}>
        <Form onSubmit={this.formSubmit.bind(this)}>
         <View style={[_styleSheet["item-group"], _styleSheet["pt0"], _styleSheet["pb0"]]}>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>标题</View>
             <Input name="title" placeholderClass="placeholder_class" placeholder="请填写标题(已建设工程相关)" style={_styleSheet["from-input"]} />
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>资质类别</View>
             <Picker name="qualificationsType" mode="selector" range={qualificationsTypeArr} onChange={this.changePicker.bind(this, 'qualificationsType')} style={_styleSheet["input-picker"]}>
               <View style={_styleSheet["tt"]}>
                 {!qualificationsType && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"], _styleSheet["placeholder-class"]]}>点击选择</View>}
                 {qualificationsType && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"]]}>{qualificationsType}</View>}
                 <Image src={right} style={_styleSheet["drop-down-icon"]} />
               </View>
             </Picker>
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>价格区间(万)</View>
             <Picker name="priceInterval" mode="selector" range={priceIntervalArr} onChange={this.changePicker.bind(this, 'priceInterval')} style={_styleSheet["input-picker"]}>
               <View style={_styleSheet["tt"]}>
                 {!priceInterval && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"], _styleSheet["placeholder-class"]]}>点击选择</View>}
                 {priceInterval && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"]]}>{priceInterval}万</View>}
                 <Image src={right} style={_styleSheet["drop-down-icon"]} />
               </View>
             </Picker>
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>资质级别</View>
             <Picker name="qualificationLevel" mode="selector" range={qualificationLevelArr} onChange={this.changePicker.bind(this, 'qualificationLevel')} style={_styleSheet["input-picker"]}>
               <View style={_styleSheet["tt"]}>
                 {!qualificationLevel && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"], _styleSheet["placeholder-class"]]}>点击选择</View>}
                 {qualificationLevel && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"]]}>{qualificationLevel}</View>}
                 <Image src={right} style={_styleSheet["drop-down-icon"]} />
               </View>
             </Picker>
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>纳税人类型</View>
             <Picker name="taxpayerType" mode="selector" range={taxpayerTypeArr} onChange={this.changePicker.bind(this, 'taxpayerType')} style={_styleSheet["input-picker"]}>
               <View style={_styleSheet["tt"]}>
                 {!taxpayerType && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"], _styleSheet["placeholder-class"]]}>点击选择</View>}
                 {taxpayerType && <View style={[_styleSheet["from-input"], _styleSheet["picker-con"]]}>{taxpayerType}</View>}
                 <Image src={right} style={_styleSheet["drop-down-icon"]} />
               </View>
             </Picker>
           </View>
           <Textarea name="remarks" placeholderClass="placeholder-class" placeholder="请填相关备注内容" maxlength={-1} style={[_styleSheet["from-textarea"], _styleSheet["height100"]]} />
           <View style={_styleSheet["input-group"]}>
           </View>
         </View>

         <View style={_styleSheet["interval"]} />

         <View style={[_styleSheet["item-group"], _styleSheet["pt0"], _styleSheet["pb0"]]}>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>联系人</View>
             <Input name="contactsName" placeholderClass="placeholder_class" placeholder="请填写联系人" style={_styleSheet["from-input"]} />
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>联系电话</View>
             <Input name="contactsPhone" type={"number"} maxLength={11} placeholderClass="placeholder_class" placeholder="请填写联系电话" style={_styleSheet["from-input"]} />
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>微信号</View>
             <Input name="contactsWechat" placeholderClass="placeholder_class" placeholder="请填写微信号" style={_styleSheet["from-input"]} />
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>QQ号</View>
             <Input name="contactsQQ" placeholderClass="placeholder_class" placeholder="请填写QQ号" style={_styleSheet["from-input"]} />
           </View>
           <View style={_styleSheet["input-group"]}>
             <View style={_styleSheet["input-name"]}>联系地址</View>
             
             <PickerArea onPicketArea={this.onPicketArea.bind(this)} level={1} />
           </View>
         </View>

         <Button formType="submit" disabled={disabled} loading={loading} style={_styleSheet["page-submit"]}>{submitText}</Button>
       </Form>

        <PageFooterInfo />
      </View>;
  }
};
Page3 = tslib_1.__decorate([inject("stores"), observer], Page3);
export default Page3;